import useUser, { ThemeContext, MsgContext } from './useUser'

export default function App() {
  const Home = () => {
    const { theme, msg } = useUser()
    return (
      <h1>
        Home---{msg}---{theme}
      </h1>
    )
  }

  const About = () => {
    const { theme, msg } = useUser()
    return (
      <h1>
        About---{msg}---{theme}
      </h1>
    )
  }

  return (
    <div>
      <h1>App</h1>
      <ThemeContext.Provider value="主题颜色">
        <MsgContext.Provider value="app组件的数据">
          <Home />
          <About />
        </MsgContext.Provider>
      </ThemeContext.Provider>
    </div>
  )
}
